Making transparent and matted Photoshop images

Transparency makes it possible to place a non-rectangular graphic object against the background of a Web page. Background transparency, supported by GIF and PNG formats, preserves transparent pixels in the image. These pixels blend with the Web page background in a browser.

Background matting, supported by GIF, PNG, and JPEG formats, simulates transparency by filling or blending transparent pixels with a matte color which you choose to match the Web page background on which the image will be placed. Background matting works only if the Web page background will be a solid color, and if you know what that color will be.

The original image must contain transparent pixels in order for you to create background transparency or background matting in the optimized image.

To create background transparency in a GIF or PNG image:

In the Optimize panel in the Save For Web dialog box, select Transparency. The option is selected by default.

Fully transparent pixels in the image are preserved as transparent. If the image is anti-aliased, you can matte partially transparent pixels to blend with a Web page background color. You can also create hard-edged transparency to prevent the halo effect that results if an anti-aliased image is matted on a color that differs from the image's original background color. If the image contains alpha transparency, you can create multilevel transparency to preserve up to 256 levels of transparency (in PNG-24 format only).

Images and Page Design > Making transparent and matted Photoshop images

Related subtopics: